<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery.min.js"></script>
		<script src="bootstrap/js/bootstrap.min.js"></script>
		<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css" />
		<link rel="stylesheet" type="text/css" href="xiaomi.css" />
		<title>小米商城</title>
	</head>

	<body>
		<!--导航条-->
		<div class="head_box">
			<div id="head_wrap">
				<div id="head_nav">
					<a href="#" class="head_nav_a">小米商城</a>
					<span>|</span>
					<a href="#" class="head_nav_a">MIUI</a>
					<span>|</span>
					<a href="#" class="head_nav_a">米聊</a>
					<span>|</span>
					<a href="#" class="head_nav_a">游戏</a>
					<span>|</span>
					<a href="#" class="head_nav_a">多看阅读</a>
					<span>|</span>
					<a href="#" class="head_nav_a">云服务</a>
					<span>|</span>
					<a href="#" class="head_nav_a">金融</a>
					<span>|</span>
					<a href="#" class="head_nav_a">小米商城移动版</a>
					<span>|</span>
					<a href="#" class="head_nav_a">问题反馈</a>
					<span>|</span>
					<a href="#" class="head_nav_a">Select Region</a>
				</div>
				<div id="head_right">
					<div id="denglu">
						<a href="#" class="head_nav_a">登陆</a>
						<span>|</span>
						<a href="#" class="head_nav_a">注册</a>
						<span>|</span>
						<a href="#" class="head_nav_a">消息通知</a>
					</div>
					<div id="head_car">
						<a href="#" class="head_nav_a"><img src="gouwu1.png" />购物车(0)</a>
						<div id="car_content">
							<span class="car_text">购物车中还没有商品。赶紧选购吧！</span>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!--搜索框-->

		<div class="main_box">
			<div class="main_wrap">
				<div class="main_logo">
					<img src="xiaomiimage/logo.png" />
				</div>
				<div class="main_nav">
					<ul>
						<li class="main_nav_a">小米手机</li>
						<li class="main_nav_a">红米</li>
						<li class="main_nav_a">平板&nbsp;·&nbsp;笔记本</li>
						<li class="main_nav_a">电视</li>
						<li class="main_nav_a">盒子&nbsp;·&nbsp;影音</li>
						<li class="main_nav_a">路由器</li>
						<li class="main_nav_a">智能软件</li>
						<li>
							<a href="#">服务</a>
						</li>
						<li>
							<a href="#">社区</a>
						</li>
					</ul>
				</div>
				<div class="main_search">
					<div class="main_input">
						<input type="text" class="input" />
					</div><div class="main_search_go">
						<a href="#">
							<span class="glyphicon glyphicon-search"></span></a>
					</div>
				</div>
			</div>
		</div>

		<!--banner广告-->
		<div class="banner_wrap">
			<ul class="banner_menu">
				<li>
					<a href="">手机&nbsp;电话卡</a>
					<a href="" class="banner_menu_gt">&gt;</a>
				</li>
				<li>
					<a href="">笔记本&nbsp;平板</a>
					<a href="" class="banner_menu_gt">&gt;</a>
				</li>
				<li>
					<a href="">电视&nbsp;盒子</a>
					<a href="" class="banner_menu_gt">&gt;</a>
				</li>
				<li>
					<a href="">路由器&nbsp;智能硬件</a>
					<a href="" class="banner_menu_gt">&gt;</a>
				</li>
				<li>
					<a href="">移动电源&nbsp;电池&nbsp;插线板</a>
					<a href="" class="banner_menu_gt">&gt;</a>
				</li>
				<li>
					<a href="">耳机&nbsp;音箱</a>
					<a href="" class="banner_menu_gt">&gt;</a>
				</li>
				<li>
					<a href="">保护膜&nbsp;贴膜</a>
					<a href="" class="banner_menu_gt">&gt;</a>
				</li>
				<li>
					<a href="">线材&nbsp;支架&nbsp;存储卡</a>
					<a href="" class="banner_menu_gt">&gt;</a>
				</li>
				<li>
					<a href="">箱包&nbsp;服饰</a>
					<a href="" class="banner_menu_gt">&gt;</a>
				</li>
				<li>
					<a href="">米兔&nbsp;生活周边</a>
					<a href="" class="banner_menu_gt">&gt;</a>
				</li>
			</ul>

			<div class="banner_pic">
				<ul class="banner_pic_ul">
					<li><img src="xiaomiimage/156261da-1a35-4ffa-b70d-efe1d46704ed.jpg" /></li>
					<li><img src="xiaomiimage/9a959f96-e108-4e3e-9725-f6620f939986.jpg" /></li>
					<li><img src="xiaomiimage/a5b9da7e-35d8-436c-b9dd-b6f06fe725d0.jpg" /></li>
					<li><img src="xiaomiimage/78f36bf8-f4d8-4f8a-afe6-24cd7721ccbe.jpg" /></li>
					<li><img src="xiaomiimage/de3a0be1-a817-4262-9536-db47ae18b19b.jpg" /></li>
				</ul>
				<div class="banner_point">
					<span>.</span>
					<span>.</span>
					<span>.</span>
					<span>.</span>
					<span>.</span>
				</div>
				<div class="banner_change">
					<span class="change_prev"></span>
					<span class="change_next"></span>
				</div>
			</div>
		</div>

		<div class="content">
			<div class="content_icon">
				<ul class="content_icon_ul">
					<li class="content_icon_li">
						<div class="icon_div">
							<a href="#">
								<img src="xiaomiimage/手机.png" />
								<p>选购手机</p>
							</a>
						</div>
					</li>
					<li class="content_icon_li">
						<div class="icon_div">
							<a href="#">
								<img src="xiaomiimage/tg.png" />
								<p>企业团购</p>
							</a>
						</div>
					</li>
					<li class="content_icon_li">
						<div class="icon_div">
							<a href="">
								<img src="xiaomiimage/cp.png" />
								<p>官翻产品</p>
							</a>
						</div>
					</li>
				</ul>

				<ul class="content_icon_ul">
					<li class="content_icon_li">
						<div class="icon_div">
							<a href="">
								<img src="xiaomiimage/yd.png" />
								<p>小米移动</p>
							</a>
						</div>
					</li>
					<li class="content_icon_li">
						<div class="icon_div">
							<a href="">
								<img src="xiaomiimage/hx.png" />
								<p>以旧换新</p>
							</a>
						</div>
					</li>
					<li class="content_icon_li">
						<div class="icon_div">
							<a href="">
								<img src="xiaomiimage/cz.png" />
								<p>话费充值</p>
							</a>
						</div>
					</li>
				</ul>
			</div>
			<div class="content_pic">
				<img src="xiaomiimage/2281c3b6-ffc0-46a5-96d4-c1be059bbd21.jpg" />
			</div>
			<div class="content_pic">
				<img src="xiaomiimage/2509ff7f-bdf9-491e-aa13-288c010cec6b.jpg" />
			</div>
			<div class="content_pic">
				<img src="xiaomiimage/9079b625-6965-41be-b98e-aaa6f476bf4d.jpg" />
			</div>
		</div>

		<!--明星单品-->
		<div class="content_star">
			<div class="title">
				<div class="star_title">
					<span>小米明星单品</span>
				</div>
				<div class="star_change">
					<span class="star_change_prev"><</span>
					<span class="star_change_next">></span>
				</div>
			</div>
			<div class="content_star_hot">
				<ul>
					<li>
						<a href=""><img src="xiaomiimage/725a37e3-78b7-4298-8098-c40097bf179d.png" /></a>
						<a href="" class="mz">
							<p>小米笔记本</p>
						</a>
						<p class="sm">更薄更轻，想杂志一样随身携带</p>
						<p class="jg">3499元起</p>
					</li>
					<li>
						<a href=""><img src="xiaomiimage/3c2eb703-e600-4cd7-934f-699825d4c2e4.png" /></a>
						<a href="" class="mz">
							<p>小米电视3s 曲面</p>
						</a>
						<p class="sm">匠心设计，最美的小米电视</p>
						<p class="jg">8999元</p>
					</li>
					<li>
						<a href=""><img src="xiaomiimage/17fc57e5-e332-4452-bba4-ef341f6e59fd.png" /></a>
						<a href="" class="mz">
							<p>小米移动电源2</p>
						</a>
						<p class="sm">双向快充，高密度锂聚合物电芯</p>
						<p class="jg">79元</p>
					</li>
					<li>
						<a href=""><img src="xiaomiimage/zxc80-80.jpg" /></a>
						<a href="" class="mz">
							<p>米家骑记电助力折叠自行车</p>
						</a>
						<p class="sm">力矩传感电助力，折叠便携设计</p>
						<p class="jg">2999元</p>
					</li>
					<li>
						<a href=""><img src="xiaomiimage/jiqiren.jpg" /></a>
						<a href="" class="mz">
							<p>米家扫地机器人</p>
						</a>
						<p class="sm">智能路径规划，扫得干净扫得快</p>
						<p class="jg">1699元</p>
					</li>
				</ul>
			</div>
		</div>

		<div id="main_show_box">
			<div id="floor_1">
				<div id="floor_head">
					<span class="title_span">智能硬件</span>
				</div>
				<!--<div class="floor_right">
              	<span class="right_span">查看全部</span>
              </div>-->
			</div>
			<div class="floor_goods_wrap">
				<ul>
					<li class="floor_goods_wrap_li">
						<a><img src="xiaomiimage/T1RHJgBmJv1RXrhCrK.jpg"></a>
					</li>
					<li class="floor_goods_wrap_li">
						<a class="floor_goods_img"><img src="xiaomiimage/pms_1468806372.46368911!220x220.jpg"></a>
						<a class="floor_goods_tit">米家小白智能摄像机</a>
						<a class="floor_goods_txt">360° 全景拍摄，1080P 高清摄像</a>
						<a class="floor_goods_price">199元</a>
					</li>
					<li class="floor_goods_wrap_li">
						<a class="floor_goods_img"><img src="xiaomiimage/pms_1478656331.65637548!220x220.jpg"></a>
						<a class="floor_goods_tit">米兔儿童手表</a>
						<a class="floor_goods_txt">11 重安全设计，五重精准定位</a>
						<a class="floor_goods_price">49.9元</a>
					</li>
					<li class="floor_goods_wrap_li">
						<a class="floor_goods_img"><img src="xiaomiimage/gushiji80.jpg"></a>
						<a class="floor_goods_tit">米兔智能故事机</a>
						<a class="floor_goods_txt">能看能听能说，手机远程观看</a>
						<a class="floor_goods_price">149元</a>
					</li>
					<li class="floor_goods_wrap_li">
						<a class="floor_goods_img"><img src="产品图片/dianfanbao-80.jpg"></a>
						<a class="floor_goods_tit">米家压力电饭煲</a>
						<a class="floor_goods_txt">智能烹饪，灰铸铁粉体涂层内胆</a>
						<a class="floor_goods_price">999元</a>
					</li>
					<li class="floor_goods_wrap_li">
						<a class="floor_goods_img"><img src="产品图片/huabanche80.jpg"></a>
						<a class="floor_goods_tit">小米米滑板车</a>
						<a class="floor_goods_txt">极简几何设计，1 分钟轻松上手</a>
						<a class="floor_goods_price">1999元</a>
					</li>
					<li class="floor_goods_wrap_li">
						<a class="floor_goods_img"><img src="xiaomiimage/pms_1473125484.8332236!220x220.jpg"></a>
						<a class="floor_goods_tit">米家飞利浦台灯</a>
						<a class="floor_goods_txt">感知环境光，主动优化场景照明</a>
						<a class="floor_goods_price">129元</a>
					</li>
					<li class="floor_goods_wrap_li">
						<a class="floor_goods_img"><img src="xiaomiimage/pms_1479182984.26159750!220x220.jpg"></a>
						<a class="floor_goods_tit">防雾霾口罩</a>
						<a class="floor_goods_txt">过滤 99.97% PM2.5 颗粒物</a>
						<a class="floor_goods_price">59元</a>
					</li>
					<li class="floor_goods_wrap_li">
						<a class="floor_goods_img"><img src="xiaomiimage/cbabf443-1ff1-4014-a1bf-06c45476f1e6.png"></a>
						<a class="floor_goods_tit">米兔定位电话</a>
						<a class="floor_goods_txt">高清双向通话，五重精准定位</a>
						<a class="floor_goods_price">139元</a>
					</li>
					<div style="clear:both;"></div>
				</ul>
			</div>
		</div>

		<script type="text/javascript" src="js/xiaomi.js"></script>
	</body>

</html>